﻿@model vwsol_DuHoc.Areas.Administrator.Models.Course

<style type="text/css">
    .alert
    {
    	display:none;
    }
</style>

<script type="text/javascript">
    var isFirstLoad = true;

    $(document).ready(function () {
        $("#dialog").dialog({ autoOpen: false, width: 330, modal: true, resizable: false });
        ShowArlert();
    });

    function InsertImage() {
        if (CKEDITOR.currentInstance) {
            $("#dialog").dialog("open");
            $("#popupFileText").width(200);
        }
        else
            alert('Chọn văn bản!');
    }

    function UploadImage() {
        var loaderImg = '@Url.Content("~/Areas/Administrator/Content/img/loader.gif")';
        add_loader_custom($("#dialog"), loaderImg);
        $("#ImgForm").submit();
    }

    function UploadImage_Complete() {
        if (isFirstLoad == true) {
            isFirstLoad = false;
            return;
        }
        document.getElementById("ImgForm").reset();
        var newImg = $.parseJSON($("#UploadTarget").contents().find("#jsonResult")[0].innerHTML);
        if (newImg.IsValid == false) {
            alert(newImg.Message);
            remove_loader($("#dialog"));
            return;
        }
        var imgHtml = CKEDITOR.dom.element.createFromHtml("<img src='" + newImg.Message + "' alt='image'/>");
        CKEDITOR.instances['CourseContent'].insertElement(imgHtml);
        remove_loader($("#dialog"));
        $("#dialog").dialog("close");
    }

    function ShowArlert() {
        var Error = '@ViewBag.Error';
        if (Error != '')
            $(".alert-error").show();
        var Success = '@ViewBag.Success';
        if (Success != '')
            $(".alert-success").show();
        var Warning = '@ViewBag.Warning';
        if (Warning != '')
            $(".alert-info").show();
    }
</script>

<div class="page-header">
    <div class="icon">
        <span class="ico-pen-2"></span>
    </div>
    <h1>
        Thêm khóa học <small>VWSOL METRO STYLE ADMIN PANEL</small></h1>
</div>
<div class="row-fluid">
    <div class="block">
        <div class="alert alert-error">            
            <strong>@ViewBag.Error</strong>
        </div>
        <div class="alert alert-success">            
            <strong>@ViewBag.Success</strong>
        </div>            
        <div class="alert alert-info">            
            <strong>@ViewBag.Warning</strong>
        </div>
        <div class="head">                                
            <h2>Thông tin khóa học</h2>
            <ul class="buttons">             
                <li><a href="javascript:void(0)"><div class="icon"><span class="ico-info"></span></div></a></li>
            </ul>                                  
        </div>
        @using (Html.BeginForm("CreateCourse", "AdminCourse", FormMethod.Post, new { id = "validate", enctype = "multipart/form-data" }))
        {
            <div class="data-fluid">               
                <div class="span6">
                    <div class="row-form">
                        <div class="span3">Tên khóa học:</div>
                        <div class="span9"><input id="CourseName" name="CourseName" type="text" class="validate[required]" value="@Model.CourseName"/></div>
                    </div>
                    <div class="row-form">
                        <div class="span3">Mô tả khóa học:</div>
                        <div class="span9"><textarea id="CourseDescription" name="CourseDescription" class="validate[required]">@Model.CourseDescription</textarea></div>
                    </div>
                    <div class="row-form">
                        <div class="span3">Tag:</div>
                        <div class="span9"><input id="CourseTag" name="CourseTag" type="text" class="tags" value="@Model.CourseTag"/></div>
                    </div>
                    <div class="row-form">
                        <div class="span3">Hình ảnh:</div>
                        <div class="span9">                            
                            <div class="input-append file">
                                <input type="file" name="file"/>
                                <input type="text"/>
                                <button type="button" class="btn">Browse</button>
                            </div>                            
                        </div>
                    </div> 
                </div>
                <div style="clear:both;">&nbsp;</div>
                <div class="head blue">
                    <h2>Chi tiết khóa học</h2>                                                           
                </div>
                <div class="data-fluid">
                    <textarea id="CourseContent" name="CourseContent" style="height: 300px;">@Html.Raw(Model.CourseContent)</textarea>
                    <script>
                        var ckeditor = CKEDITOR.replace('CourseContent');
                        CKEDITOR.disableAutoInline = true;
                    </script>
                </div>
                <div class="data-fluid">
                    <div class="span9" style="margin-top:5px;">
                        <button class="btn" type="button" onclick="InsertImage();">
                            <span class="icon-th icon-white"></span>
                            Chèn hình ảnh
                        </button>
                        <button class="btn" type="submit">
                            <span class="icon-th icon-white"></span>
                            Lưu khóa học
                        </button>
                    </div>
                </div>
            </div>
        }  
    </div>
</div>

<div id="dialog" title="Upload hình ảnh">
    @using (Html.BeginForm("UploadImage", "AdminBase", FormMethod.Post, new { enctype = "multipart/form-data", id = "ImgForm", name = "ImgForm", target = "UploadTarget" }))
    {
        <div class="row-fluid">
            <div class="block-fluid">
                <div class="row-form">
                    <div class="span9">
                        <div class="input-append file">
                            <input type="file" name="file" accept="image/*"/>
                            <input id="popupFileText" type="text"/>
                            <button type="button" class="btn">Browse</button>
                        </div>
                    </div>
                    <div style="float:left;">
                        <button class="btn" type="button" onclick="UploadImage();">
                            <span class="icon-th icon-white"></span>
                            Chèn hình ảnh
                        </button>
                    </div>
                </div>
            </div>
        </div>
        <iframe id="UploadTarget" name="UploadTarget" onload="UploadImage_Complete();" style="position: absolute;left: -999em; top: -999em;"></iframe>
    }
</div>
